<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">


    <title>添加文章</title>

    <link href="{{asset('css/bootstrap.min.css')}}" rel="stylesheet">
    <link href="{{asset('font-awesome/css/font-awesome.css')}}" rel="stylesheet">

    <link href="{{asset('css/animate.css')}}" rel="stylesheet">
    <link href="{{asset('css/style.css')}}" rel="stylesheet">
    <link href="{{asset('css/simplemde.min.css')}}" rel="stylesheet">

</head>

<body>
<div class="container">
    <div class="row">
        <div class="ibox">
            <div class="ibox-title">
                <h5>编辑文章内容</h5>
                <a href="{{route('backend.article.index')}}" class="btn pull-right btn-primary">返回列表</a>
                <div class="clearfix"></div>
            </div>
            <div class="ibox-content">
                <div class="row ">
                    <form method="post" role="form" action="{{route('backend.article.set-content',$article)}}">
                        @csrf
                        <div class="form-group">
                            <h3>{{$article->title}}</h3>
                        </div>
                        <div class="form-group"><label >内容 @include('components.backend.required')</label>
                            <textarea name="content" id="content" cols="30" rows="10" class="form-control" required>{{$article->content['raw']}}</textarea>
                        </div>

                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <button class="btn btn-primary" type="submit">提交</button>
                        </div>
                    </form>
                </div>

            </div>
        </div>
    </div>
</div>
<!-- Mainly scripts -->
<script src="{{asset('js/jquery-2.1.1.js')}}"></script>
<script src="{{asset('js/bootstrap.min.js')}}"></script>
<script src="{{asset('js/simplemde.min.js')}}"></script>

<script>
    var simplemde = new SimpleMDE({
        element: document.getElementById("content") ,
        autoDownloadFontAwesome:false,
        autofocus:true,
        // autosave: {
        //     enabled: true,
        //     uniqueId: "SimpleMDE",
        //     delay: 1000,
        // },
        blockStyles: {
            bold: "**",
            italic: "*",
            code: "```"
        },
        forceSync: true,
        hideIcons: false,
        indentWithTabs: true,
        lineWrapping: true,
        renderingConfig:{
            singleLineBreaks: false,
            codeSyntaxHighlighting: true // 需要highlight依赖
        },
        showIcons: true,
        spellChecker: true
    });
    //simplemde.toggleSideBySide();
</script>


</body>
</html>
